Fantasy Artist 39/Fantasy Artist - Issue 39.bin/js/panelView.js

JavaScript | 2011-08-09 | 1.6 KB | 70 lines

$(document).ready(function()
{
    var sourceList = $("div.tree > ul");

    var issueDiv = document.createElement('div');
    $(issueDiv).addClass('quick_search');
    $(sourceList).parent().after(issueDiv);

    var panelView = document.createElement('div');
    $(panelView).addClass('cat_panel');
    $(issueDiv).append(panelView);

    $(sourceList).children('li').each(
        function()
        {
            // Looping through each list item and adding it to
            // the panel div.
            var newLink = document.createElement('a');
            $(panelView).append(newLink);
            $(newLink).html($(this).children('span.cat').text());
        }
    );

    $('.cat_panel a').live('click',
        function(e)
        {
            var catSpan = $('div.tree span.cat:contains("'+$(this).text()+'")');

            if(catSpan.length > 0)
            {
                $(this).parent().nextAll().remove();
                // Create a new div

                var newPanel = document.createElement('div');
                $(newPanel).addClass('cat_panel');
                $(this).parent().after($(newPanel));
                $(newPanel).hide();

                // Find li's from that category
                var newItems = $(catSpan).parent().children('ul').children('li'); // Three list items

                $(newItems).each(
                    function()
                    {
                        if ($(this).children('span').length > 0 )
                        {
                            var newLink = document.createElement('a');
                            $(newLink).html($(this).children('span.cat').text());
                            $(newPanel).append($(newLink));
                        }
                        else
                        {
                            var newLink = $(this).clone();
                            $(newPanel).append(newLink);
                        }
                    }
                );

                $(newPanel).fadeIn('medium');

                e.preventDefault();
            }
            else
            {
                // Leaf node
            }
        }
    );
});